<template>
    <div class="contact">
      <!--<div class="box_notes">-->
        <!--*请填写您的联系信息，我们将在一个工作日内与您联系。-->
      <!--</div>-->
      <!--<div class="box">-->
        <!--<div class="left">称呼</div>-->
        <!--<div class="right">-->
          <!--<input ref="name" type="text" placeholder="称呼">-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="box">-->
        <!--<div class="left">联系电话</div>-->
        <!--<div class="right">-->
          <!--<input ref="phone"  type="text" placeholder="联系电话">-->
        <!--</div>-->
      <!--</div>-->
      <!--<div class="box">-->
        <!--<textarea ref="content" class="Text" placeholder="添加备注（不超过120字）"></textarea>-->
      <!--</div>-->
      <!--<div class="box_btn">-->
        <!--<input type="button" value="提交" @click="apply()">-->
      <!--</div>-->
      <div class="er-code">
        <img src="../../assets/images/er_code.jpg" alt="">
        <a href="tel:0596-2065252">0596-2065252</a>
      </div>

    </div>
</template>

<script>
  import global from '../public/global.vue'
    export default {
        name: "contact",
      data() {
        return {}
      },
      created: function () {
        document.title = "联系我们";
      },methods: {
        apply() {
          let name = this.$refs.name.value;
          let content = this.$refs.content.value;
          let phone = this.$refs.phone.value;
          if(name==""||content==""||phone==""){
            alert("输入不正确")
            return;
          }
          let params = new URLSearchParams();
          params.append("name",name);
          params.append("content",content);
          params.append("phone",phone);

          this.$http({
            url: global.apiUrl + '/contact/contactUs',
            method: 'post',
            data:  params,
          }).then(res => {
            alert(res.data.msg)
          })

        },
      },
    }
</script>

<style lang="less" scoped>
    .contact{
      width: 100%;
      min-height: 80px;
      margin: 0 auto;
      .box_notes{
        width: 95%;
        margin: 10px auto;
        font-size: 0.8rem;
        color: #FF0000;
        text-align: left;
      }
      .box>textarea{
        width: 100%;
        height: 60px;
        resize: none;
        margin-top: 10px;
        font-size: 0.95rem;
        padding-top: 10px;
        border: none;
        outline: none;
        font-weight: bold;
      }
      .Text::-webkit-input-placeholder{
        color: #e2dfdf;
      }
      .box_btn{
        width: 92%;
        margin: 80px auto;
      }
      .box_btn>input{
        width: 100%;
        height: 35px;
        background: #D53F40;
        outline: none;
        border: none;
        color: #FFF;
        font-size: 1rem;
        border-radius: 6px;
        letter-spacing: 5px;
      }
      .box{
        width: 90%;
        min-height: 40px;
        border-bottom: 1px dashed #a7a5a5;
        margin: 0 auto;
        .left{
          width: 25%;
          height: 40px;
          float: left;
          line-height: 40px;
          color: #a7a5a5;
          font-size: 0.9rem;
        }
        .right{
          width: 75%;
          height: 40px;
          float: left;
        }
        .right>input{
          width: 95%;
          height: 38px;
          border: none;
          padding-left: 10px;
          font-size: 1rem;
          outline: none;
          text-align: center;
        }
      }
      /*二维码*/
      .er-code{
        width:100%;
        text-align: center;
        img{
          width:100%;
          margin-top:0%;
          box-shadow: 1px 1px 10px 0px rgba(0,0,0,.5);
        }
        a{
          display: inline-block;
          margin-top:5%;
          font-size: 2rem;
          color: #d44242;
          text-shadow:0px 0px 6px  rgba(0,0,0,.2);
          /*text-decoration: underline;*/
          /*color: #17caf2;*/
        }
      }
    }
</style>
